<!--
 * @Author: weikang
 * @Description:
 * @Date: 2024-01-09 21:19:16
 * @LastEditTime: 2024-02-24 13:20:43
 * @FilePath: \env-manager-pc\src\views\assets\demolish\edit.vue
-->
<script setup lang="ts">
import type { FormInstance } from 'element-plus'
import dayjs from 'dayjs'
import { useInitForm } from './page'
import { OperateType } from '@/views/assets/get/operate.common'
import type { ModelOpenCustom } from '@/types/page'
import useUserStore from '@/store/modules/user'

const emits = defineEmits(['submit'])
const userStore = useUserStore()
const dialogVisible = ref(false)
const { formData, initForm } = useInitForm()
const formRef = ref<FormInstance>()
const btnLoading = ref(false)
const modelType = ref(OperateType.single)
const tempRowData = ref<any>({})

const getTime = ref('')

function open(options: ModelOpenCustom<OperateType>) {
  modelType.value = options.type
  if (options.data) {
    tempRowData.value = { ...options.data as any }
    if (options.type === OperateType.single) {
      formData.value.assetObjIDs = [tempRowData.value.AssetObjID]
    }
    else {
      formData.value.assetObjIDs = tempRowData.value.assetObjIDs
    }
  }
  getTime.value = dayjs().format('YYYY-MM-DD')
  dialogVisible.value = true
}

function doLoading(flag: boolean) {
  btnLoading.value = flag
}

function submit() {
  formRef.value?.validate((vaild) => {
    if (vaild) {
      emits('submit', formData.value, doLoading)
    }
  })
}

function close() {
  dialogVisible.value = false
  btnLoading.value = false
  initForm()
}

defineExpose({
  open,
  close,
})
</script>

<template>
  <el-dialog
    v-model="dialogVisible"

    title="拆除"
    width="80%"
    top="1%"
    draggable append-to-body
    @closed="close"
  >
    <div class="max-h-[65vh] w-full overflow-x-hidden overflow-y-auto">
      <ElForm ref="formRef" label-width="180px" label-position="top" label-suffix="：" :model="formData">
        <ElRow :gutter="30">
          <ElCol v-if="modelType === OperateType.single" :span="12">
            <ElFormItem label="设备编码" prop="Name">
              <ElInput v-model="tempRowData.AssetCode" disabled />
            </ElFormItem>
          </ElCol>
          <ElCol :span="12">
            <ElFormItem label="拆除日期" prop="Name">
              <ElInput v-model="getTime" disabled />
            </ElFormItem>
          </ElCol>
          <ElCol v-if="modelType === OperateType.single" :span="12">
            <ElFormItem label="产品名称" prop="AssetModelClassifyName">
              <ElInput v-model="tempRowData.AssetModelClassifyName" disabled />
            </ElFormItem>
          </ElCol>
          <ElCol v-if="modelType === OperateType.single" :span="12">
            <ElFormItem label="型号" prop="AssetModelName">
              <ElInput v-model="tempRowData.AssetModelName" disabled />
            </ElFormItem>
          </ElCol>
          <ElCol :span="12">
            <ElFormItem label="资产状态" prop="StateName">
              <ElInput value="拆除" disabled />
            </ElFormItem>
          </ElCol>
          <ElCol :span="12">
            <ElFormItem label="拆除人" prop="Location">
              <ElInput v-model="userStore.userInfo.Name" disabled />
            </ElFormItem>
          </ElCol>
          <ElCol :span="12">
            <ElFormItem label="备注" prop="Location">
              <ElInput v-model="formData.remark" />
            </ElFormItem>
          </ElCol>
        </ElRow>
      </ElForm>
    </div>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="dialogVisible = false">取消</el-button>
        <el-button type="primary" :loading="btnLoading" @click="submit">
          确定
        </el-button>
      </span>
    </template>
  </el-dialog>
</template>
